﻿.imagesSample .picture {
    width: 200px; 
    height: 200px;
    background-size: cover;    
}

.imagesSample .picture.small {
    width: 100px; 
    height: 100px;
}

.imagesSample .picture.animate {
    transition: all 1s ease-out;
    opacity: 0;
    transform: scale(1.2);    
}

/* 
    the imageLoaded class is added by the binding once image is ready
    it enables animating the image apperance
*/
    .imagesSample .picture.animate.imageLoaded {
        opacity:1;
        transform:scale(1);
    }